<template>
  <div class="data-manage">
    <common-Form
        :fieldsList="aaaField"
        :hideTable="false"
        :table-head="firstTableHead"
        :hidePagination="false"
        ref="case_tableForm"
        :defaultData="defaultData"
        :tableHeight="1000"
        :tableUrl="'/list/case_list'"
    >
      <template v-slot:formBtn>
        <div style="text-align: right;width: 100%;">
          <el-button type="primary" size="mini" @click="handleQuery">搜索</el-button>
        </div>
        <el-button
            type="primary"
            icon="el-icon-upload2"
            size="mini"
            @click="handleImport"
            style="margin-left: 20px"
        >导入</el-button>

<!--        <el-button type="primary" size="mini" @click="case_pic" >统计</el-button>-->
      </template>

    </common-Form>

    <common-Dialog ref="Case_pic_table" :customClass="'Case_pic_table-dialog'">

      <template v-slot:content>
      <img :src="require('@/assets/img/jiebao/jiebao.png')" style="width: 100%">
        </template>

    </common-Dialog>

    <el-dialog :title="upload.title" :visible.sync="upload.open" width="800px" append-to-body>
      <el-upload
          ref="upload"
          :limit="1"
          accept=".xlsx, .xls"
          :action="upload.url + '?updateSupport=' + upload.updateSupport"
          :disabled="upload.isUploading"
          :on-progress="handleFileUploadProgress"
          :on-success="handleFileSuccess"
          :auto-upload="false"
          drag
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip text-center" slot="tip">
          <span>仅允许导入xls、xlsx格式文件。</span>
        </div>
      </el-upload>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFileForm">确 定</el-button>
        <el-button @click="upload.open = false">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import commonDialog from '@/components/commonDialog/common.dialog'
import commonForm from '@/components/commonForm/commonForm.component'
import API from "@/api/index.api";
import _ from "lodash";
import * as request from '@/utils/request/request'

export default {
  name: 'caseManage',
  components: {
    commonDialog,
    commonForm,
  },
  data () {
      return {
        upload: {
          // 是否显示弹出层（用户导入）
          open: false,
          // 弹出层标题（用户导入）
          title: "",
          // 是否禁用上传
          isUploading: false,
          // 是否更新已经存在的用户数据
          updateSupport: 0,
          // 设置上传的请求头部
        /*  headers: { Authorization: "Bearer " + getToken() },*/
          // 上传的地址
          url: request.baseURL + "/list/importCaseData"
        },
        aaaField: [
          {
            type: 'text',
            code:'keyWord'
          },

        ],
        firstTableHead: [
          {
            prop: 'case_no',
            label: '案件编号'
          },
          {
            prop: 'case_name',
            label: '案件名称'
          },
          {
            prop: 'case_type',
            label: '统计案由'
          },
          {
            prop: 'create_station',
            label: '立案单位'
          },
          {
            prop: 'create_time',
            label: '立案时间',
            width: 300
          },
          // {
          //   prop: 'monies',
          //   label: '涉案金额'
          // },
          {
            prop: 'summation',
            label: '简要案情',
            width: 1000
          },
        ],
        defaultData: [
          {
            'case_no': '反诈中心',
            'case_name': '18326521220',
            'case_type': '林丽柳',
            'create_station': '拦截',
            'create_time': '2024-02-15 08：30：56',
            'summation': '互联网  ',
            'monies': '互联网  ',
          }]

      }
  },
  methods: {

    case_pic(){

      this.$nextTick(()=>{



        this.$refs.Case_pic_table.open({title: '详情', width: '60%'})


      })

    },

     handleQuery() {
       let params = _.clone(this.$refs.case_tableForm.form)
       this.$refs.case_tableForm.getTableData(params)
    },
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.upload.open = false;
      this.upload.isUploading = false;
      this.$refs.upload.clearFiles();
      this.$alert("导入成功");
      this.$refs.case_tableForm.getTableData()
    },
    submitFileForm() {
      this.$refs.upload.submit();
    },
    handleImport() {
      this.upload.title = "案情导入";
      this.upload.open = true;
    },

  },
  mounted () {
    //this.getWarnList()
  }
}
</script>
<style lang="stylus">
  .data-manage{
    height: 100%;
    pointer-events: auto;
    .common-form-wrap {
      height: 100%;
    }
  }
</style>
